<template>
	<view>
		<u-navbar title-color="#333" title-bold title-size="36" title="在线咨询中" :border-bottom="false"></u-navbar>
		<view class="buzhou flex flex_sb">
			<view class="buzhou-item flex " :class="buzhouIndex==1?'buzhou-item-sel':''">
				<view class="buzhou-item-num">1</view>
				<view class="buzhou-item-text">描述问题</view>
			</view>
			<view class="buzhou-item flex" :class="buzhouIndex==2?'buzhou-item-sel':''">
				<view class="buzhou-item-num">2</view>
				<view class="buzhou-item-text">匹配律师</view>
			</view>
			<view class="buzhou-item flex" :class="buzhouIndex==3?'buzhou-item-sel':''">
				<view class="buzhou-item-num">3</view>
				<view class="buzhou-item-text">进入咨询</view>
			</view>
		</view>

		<scroll-view :scroll-top="scrollTop" scroll-y="true" :style="{'height':heightC +'px'}">
			<view class="">
				<view class="ls-div u-m-t-26">
					<image class="tw-lsbg" src="../../../static/img/home/tw-lsbg.png" mode=""></image>
					<view class="text_center ls-top">
						最快 <span class="t-num">10秒</span> 应答 真人律师1对1服务
					</view>
					<view class="u-p-l-24 u-p-r-20 u-p-b-20 ls-d-t flex flex_sb">
						<view class="ls-sss-item flex">
							<image class="ls-sss" src="../../../static/img/home/ls-sss.png" mode=""></image>
							<view class="ls-te u-m-l-8">
								海量律师
							</view>
						</view>
						<view class="ls-sss-item flex">
							<image class="ls-sss" src="../../../static/img/home/ls-sss.png" mode=""></image>
							<view class="ls-te u-m-l-8">
								专业认证
							</view>
						</view>
						<view class="ls-sss-item flex">
							<image class="ls-sss" src="../../../static/img/home/ls-sss.png" mode=""></image>
							<view class="ls-te u-m-l-8">
								及时回复
							</view>
						</view>
						<view class="ls-sss-item flex">
							<image class="ls-sss" src="../../../static/img/home/ls-sss.png" mode=""></image>
							<view class="ls-te u-m-l-8">
								精准解答
							</view>
						</view>
					</view>
					<view class="flex_only u-m-t-12 flex_sb u-p-t-24 u-p-b-24 u-p-l-16" v-if="lawyerList">
						<view class="flex">
							<image class="headimg" :src="lawyerList.avatar" mode="aspectFill"></image>
							<view class="u-m-l-20  ">

								<view class="flex">
									<view class="font_14_333 font_weight">
										{{lawyerList.name}}
									</view>
									<view class="flex">
										<image class="u-m-l-8 h23" src="../../../static/img/home/h23.png" mode="">
										</image>
										<view class="font_10_333 u-m-l-8">
											{{lawyerList.province}}
										</view>
									</view>
									<view class="flex u-m-l-16 ">
										<image class="h24" src="../../../static/img/home/h24.png" mode=""></image>
										<view class="pf-t">{{lawyerList.mark}}</view>
									</view>
								</view>
								<view class="u-m-t-18 font_10_666">
									执业证号：{{lawyerList.license_num}}
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="text_center font_12_999 u-m-t-40">
					- 律师沟通中 -
				</view>
			</view>
			<view class="itemms">
				<view v-for="(item,idx) in messgageChatlist" :key="idx">
					<view :class="item.member_id==1?'chatself':'chatother'">
						<image v-if="item.member_id==1" mode="aspectFill" :src="userInfo.image"
							class="headimg u-m-l-20"></image>
						<image v-else src="../../static/img/zhushouimg.png" class="headimg u-m-r-20" @click="peoplemore"
							mode="aspectFill"></image>
						<view class="font_16_333">
							<view class="font_12_666 u-m-t-12"
								:style="{'text-align': item.member_id==1?'right':'left'}">
								{{item.member_id==1?'自己':'问理律助手'}}
							</view>
							<view :class="item.member_id==1?'chatbgvS':'chatbgvO'">
								<!-- 正常文字或链接地址 -->
								<view class="" v-if="item.type=='1'">
									{{item.member_say}}
								</view>
								<!-- 涉案金额 -->
								<view class="" v-if="item.type=='4'">
									请选择 <span class="colred" @click="typeShow=true">案件类型</span>
								</view>
								<!-- 涉案金额 -->
								<view class="" v-if="item.type=='2'">
									请选择 <span class="colred" @click="jineShow=true">涉案金额</span>
								</view>
								<!-- 涉案金额 -->
								<view class="" v-if="item.type=='3'">
									<!-- 您还未授权位置信息，您的手机号所在地为<span class="colred">{{nowcity}}</span>，请确认下您当前所在地 -->
									<!-- <view class="reBtn" @click="nowcity1">
										{{nowcity}}
									</view> -->
									请选择您当前所在地
									<view class="reBtn" @click="regionconShow=true">
										选择城市
									</view>

								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 匹配律师 -->
			<view class="" v-if="pipeishouw">
				<view class="ch-item">
					<view class="font_weight font_16_333">
						极速匹配律师中
					</view>
					<view class="jdt-div">
						<u-line-progress active-color="#FD7028" :percent="percent"></u-line-progress>
						<image :style="{'right':(608-(638/100*percent))+'rpx'}" class="jindu"
							src="../../../static/img/home/jindu.png" mode=""></image>
					</view>
					<view class="u-font-20">
						已等待 <span class="colred">00:0{{seconds}}</span>（平均等待5秒）
					</view>
				</view>
				<view class="ch-item" v-if="lvshow">
					<view class="font_weight font_16_333">
						以下<span class="colred">{{typename}}</span>律师等待接入
						<scroll-view scroll-x="true">
							<view class="u-m-t-20 flex" style="width: 100%;">

								<view class="lv-item" v-for="(item,index) in sellvshiList" :key="index">
									<view class="flex">
										<image class="lv-item-headimg" :src="item.avatar" mode="aspectFill"></image>
										<view class="u-m-l-16 wid-r">
											<view class="flex ">
												<view class="font_14_333 font_weight">
													{{item.name}}
												</view>
												<image class="u-m-l-8 jp-i" src="../../../static/img/home/h23.png"
													mode="">
												</image>
											</view>
											<view class="flex u-m-t-12">
												<view class="flex">
													<image class="ls-xing" src="../../../static/img/home/h24.png"
														mode="">
													</image>
													<view class="u-m-l-4 ls-fs">
														{{item.org_level}}
													</view>
												</view>
												<view class="flex ls-zy">
													<view class="font_10_666">
														执业：
													</view>
													<view class="ls-fs">
														{{item.license_year	}}
													</view>
												</view>
											</view>
										</view>
									</view>
									<view class="zhifubtn flex flex_cen" @click="tozhifu(item)">
										<view class="u-font-20">￥</view>
										<view class="u-font-32">{{price}}</view>
										<view class="u-font-24 u-m-l-20">去支付</view>
									</view>
								</view>

							</view>
						</scroll-view>
					</view>
				</view>

			</view>
		</scroll-view>
		<view class="gjz"  v-if="cnxwshow">
			<view class="cnxw flex flex_sb">
				<view class="">
					猜你想问：
				</view>
				<view class="" @click="lawyer_script()">
					换一批
				</view>
			</view>
			
			<view class="">
				<!-- <view class="gjz-item" v-for="i in cnxwList" :key="i" @click="content=i,sendMessage()">
					{{i}}
				</view> -->
				<view class="gjz-item u-m-t-10" v-for="(item,index) in scriptList" :key="index" @click="dudinghuashu(item)">
					{{item.title}}
				</view>
				
			</view>
		</view>
		<view class="zhanwei" v-if="inputshow"></view>
		<view class="chatinput" id="meau" v-if="inputshow">
			
			<view class="flex shurukuang">
				<input @confirm="sendMessage()" v-model="content" class="inputtext flex u-m-l-20" type="text"
					placeholder="输入要说的内容" />
				<text class="sendbtn" @click="sendMessage()">发送</text>
			</view>
		</view>


		<view class="btn-bo" v-if="xiadanShow">
			<view class="btn_login_btn flex flex_cen" @click="zhifushow=true">
				<view class="xiadan">
					去支付
				</view>
				<view class="u-m-t-8">
					<span class="m-m">(</span>
					<span class="m-fh">￥</span>
					<span class="m-m">{{price}}</span>
					<!-- <span class="m-sj">/60分钟</span> -->
					<span class="m-m">)</span>
				</view>
			</view>
		</view>

		<u-popup v-model="zhifushow" mode="bottom" closeable border-radius="32" @close="zhifuClose">
			<view class="po-bikan">
				<view class="shuxian"></view>
				<view class="">
					<view class="flex">
						<view class="chbox flex_cen flex">
							<u-icon name="checkbox-mark" color="#fff" size="24"></u-icon>
						</view>
						<view class="bk-title u-m-l-16">
							问题发布成功
						</view>
					</view>
					<view class="u-m-l-60 u-m-t-18">
						#{{typename}}
					</view>
				</view>

				<view class="flex u-p-t-48">
					<view class="chbox flex_cen flex">
						<u-icon name="more-dot-fill" color="#fff" size="24"></u-icon>
					</view>
					<view class="bk-title u-m-l-16">
						以下<span class="colred">{{typename}}</span>律师等待接入
					</view>
				</view>
				<view class="u-m-t-20 flex  flex_wrap zf-i-div">
					<view class="zf-item" v-for="(item,index) in sellvshiList" :key="index">
						<image class="zf-img" :src="item.avatar" mode="aspectFill"></image>
						<view class="font_12_333 u-m-t-16"> {{item.name}}</view>
					</view>
				</view>

				<view class="flex flex_sb u-border-bottom u-p-b-24 u-p-t-24">
					<view class="bk-title">
						选择服务
					</view>
					<view class="bk-title">
						电话服务
					</view>
				</view>
				<view class="flex flex_sb u-p-b-24 u-p-t-24">
					<view class="bk-title">
						应付金额：
					</view>
					<view class="bk-title ">
						<span class="m-fh2 colred">￥</span>
						<span class="m-m2 colred">{{price}}</span>
					</view>
				</view>
				<view class="zhanwei"></view>
				<view class="btn-bo">
					<view class="btn_login_btn flex flex_cen" @click="tozhifu(-1)">
						<view class="xiadan">
							继续支付
						</view>
						<view class="u-m-t-8">
							<span class="m-m">(</span>
							<span class="m-fh">￥</span>
							<span class="m-m">{{price}}</span>
							<span class="m-m">)</span>
						</view>
					</view>
				</view>
			</view>
		</u-popup>
		<u-popup v-model="jineShow" mode="bottom" closeable border-radius="32">
			<view class="po-bikan">
				<view class="bk-title u-m-b-32 text_center">
					请选择涉及金额
				</view>
				<view class="jine-div flex flex_wrap">
					<view class="jine-item " v-for="(item,index) in jineList" :key="index" @click="selJine(item)">
						{{item.name}}
					</view>
				</view>
			</view>
		</u-popup>
		<u-picker mode="selector" confirm-color="#20C064" :range="typeList" v-model="typeShow" range-key="name"
			@confirm="typeconfirm"></u-picker>
		<u-select v-model="regionconShow" mode="single-column" :list="addressList" @confirm="regionconfirm"
			value-name="id" label-name="name"></u-select>
		<!-- <u-picker :params="params" mode="region" confirm-color="#651321" v-model="regionconShow"
			@confirm="regionconfirm"></u-picker> -->
			
		<youhui v-if="yhshow" :yhqlist="yhList" @close="youhuiclose"></youhui>
		
		<couponList :couponShow="couponShow" @shiyong="shiyong" type="1"></couponList>
	</view>
</template>

<script>
	import couponList from '../../../components/couponList/couponList.vue';
	import youhui from '../../../components/youhui/youhui.vue';
	export default {
		components: {
			youhui,couponList
		},
		data() {
			return {
				couponShow:false,
				yhq_id:'',
				yhshow:false,
				yhList:{},
				scriptList:[],
				cnxwList:['婚姻家庭','刑事辩护','房产纠纷','交通事故'],
				counum:1,
				inputshow:true,
				cnxwshow:true,
				content:'',
				sellvshiList:[],
				typename:'',
				typeId:'',
				buzhouIndex:1,
				seconds: 0,
				userInfo:[],
				intervalId: null,
				pipeishouw: false,
				lvshow:false,
				addressList: [],
				params: {
					province: true,
					city: true,
					area: true
				},
				province:'',
				price_dur_min:'',
				price_dur_max:'',
				price:'',
				percent: 70,
				jineShow: false,
				regionconShow: false,
				xiadanShow: false,
				zhifushow: false,
				typeShow: false,
				typeList: [],
				task_id: '',
				nowcity: '北京',
				tabbar: '',
				heightC: 0,
				scrollTop: 0,
				message: "", //发送内容
				jineList: [],
				lawyerList:[],
				messgageChatlist: [{
					member_id: 2,
					member_say: '您好，很高兴为您服务，请问您遇到了什么问题',
					type: '1'
				}, {
					member_id: 2,
					member_say: '您可以在下方简单输入问题~  我将会根据您的问题，快速匹配平台律师，律师将会为您做针对性解答。',
					type: '1'
				},
				// {
				// 	member_id: 2,
				// 	member_say: '这里显示固定话述',
				// 	type: '1'
				// }, 
				],
			}
		},
		beforeDestroy() {
			clearInterval(this.intervalId);   
		},
		onLoad(e) {
			this.lawyer_script()
			this.getprice()
			this.getjineList()
			this.getInfo()
			this.heightC = 0
			setTimeout(() => {
				this.heightC = uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().statusBarHeight -
					44 - 60 - 70;
			}, 100)
			// this.heightC = uni.getSystemInfoSync().windowHeight - 190;
			this.scrollTop = 99999999
			this.getaddrerss()
			this.fuwuList()
			
			if(e.id){
				this.lvdetail(e.id)
			}else{
				this.getlawyer()
			}
			
		},
		methods: {
			shiyong(e){
				if(e){
					if(this.price*1 < e.man_price*1){
						uni.showToast({
							title: "优惠券无效，不足满减金额",
							icon: "none"
						});
						this.yhq_id = ''
						// this.price = ((this.price*1) - (e.jian_price*1)).toFixed(2)
					}else{
						this.yhq_id = e.id
						this.price = ((this.price*1) - (e.jian_price*1)).toFixed(2)
					}
				}else{
					this.yhq_id = ''
				}
				// this.yhq_id = e
				this.couponShow = false
				console.log(e)
			},
			zhifuClose(){
				this.zhifushow = false
				this.$api({
					url: '/getYhqList',
					method: 'get',
					data: {
						token: uni.getStorageSync("token"),
					},
				}).then(res => {
					if (res.code == 1) {
						
						if(res.data.count>0){
							this.yhshow = true
							this.yhList = res.data.list[0]	
						}
						
					}
				})
				
				
			},
			youhuiclose() {
				this.yhshow = false
			},
			lawyer_script(){
				this.$api({
					url: '/lawyer_script',
					method: 'get',
					data: {
						token: uni.getStorageSync("token"),
					},
				}).then(res => {
					if (res.code == 1) {
						this.scriptList = []
						
						// this.pickedItems = [];
						while (this.scriptList.length < 3) {
						  const randomIndex = Math.floor(Math.random() * res.data.length);
						  const item = res.data[randomIndex];
						  // 确保不会选中重复的元素
						  if (this.scriptList.indexOf(item) === -1) {
						    this.scriptList.push(item);
						  }
						  
						  // console.log(this.scriptList)
						}
					}
				})
			},
			   
			   
			dudinghuashu(e){
				this.content = e.title
				
				
				this.messgageChatlist.push({
					member_id: 1,
					member_say: this.content,
					type: '1'
				})
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})
				
				this.heightC = this.heightC
				this.cnxwshow=false
				this.inputshow = false
				this.task_id = e.task_id
				this.typename = e.task.name
				this.messgageChatlist.push({
					member_id: 2,
					member_say: '根据您的描述，您当前案件类型为'+this.typename,
					type: '1'
				})
				this.messgageChatlist.push({
					member_id: 2,
					member_say: '',
					type: '2'
				})
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})
			},
			getprice() {
				this.$api({
					url: '/setting',
					method: 'get',
					data: {
						token: uni.getStorageSync("token"),
					},
				}).then(res => {
					if (res.code == 1) {
						this.price = res.data.online_order
					}
				})
			},
			lvdetail(e) {
				this.$api({
					url: '/lawyer/detail',
					method: 'get',
					data: {
						token: uni.getStorageSync("token"),
						lawyer_id: e
					},
				}).then(res => {
					if (res.code == 1) {
						this.lawyerList = res.data
					}
				})
			},
			getlawyer(){
				this.$api({
					url: '/user/look_lawyers',
					method: 'get',
					data: {
						recommend:1
					},
				}).then(res => {
					this.lawyerList = res.data.data[0]
				})
			},
			getjineList(){
				this.$api({
					url: '/case_price_range',
					method: 'get',
					
				}).then(res => {
					this.jineList = res
				})
			},
			//个人信息
			getInfo() {
				this.$api({
					url: '/getUserInfo',
					method: 'get',
					data: {
						token:uni.getStorageSync("token")
					},
				}).then(res => {
					console.log(res)
					if (res.code == 1) {
						this.userInfo = res.data
					} 
				})
			},
			
			
			
			fuwuList() {
				this.$api({
					url: '/lawyer/getTags',
					method: 'get',
					data: {
						token: uni.getStorageSync("token"),
						type: 1 //类型：1=擅长领域，2=服务类型
					},
				}).then(res => {
					if (res.code == 1) {
						this.typeList = res.data
					}
				})
			},
			typeconfirm(e) {
				this.task_id = this.typeList[e].id
				this.typename = this.typeList[e].name
				this.messgageChatlist.push({
					member_id: 1,
					member_say: this.typename,
					type: '1'
				})
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})
				setTimeout(() => {
					this.messgageChatlist.push({
						member_id: 2,
						member_say: '',
						type: '2'
					})
					this.$nextTick(() => {
						this.scrollTop = this.scrollTop + 1000
					})
				}, 1000)

			},
			getaddrerss() {
				this.$api({
					url: '/getChinaArea',
					method: 'get',
				}).then(res => {
					if (res.code == 1) {
						this.addressList = res.data
					}
				})
			},
			nowcity1() {
				this.messgageChatlist.push({
					member_id: 1,
					member_say: this.nowcity,
					type: '1'
				})
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})
				
				this.pipeishouw = true
				this.xiadanShow = true
				this.couponShow = true
				this.buzhouIndex = 2
				this.intervalId = setInterval(() => {
				  this.seconds++;  
				}, 1000); 
				 
				setTimeout(() => {
				 	clearInterval(this.intervalId);   
					this.percent = 100
					this.lvshow = true
					
					this.$nextTick(() => {
						this.scrollTop = this.scrollTop + 1000
					})
				 }, 2000)
			},
			regionconfirm(e) {
				console.log(e)
				this.province = e[0].value
				// this.address = e.province.label + e.city.label + e.area.label
				this.messgageChatlist.push({
					member_id: 1,
					member_say: e[0].label,
					type: '1'
				})
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})
				this.pipeishouw = true
				this.xiadanShow = true
				this.couponShow = true
				this.buzhouIndex = 2
				this.intervalId = setInterval(() => {
				  this.seconds++;  
				}, 1000); 
				
				
				 this.$api({
				 	url: '/user/releaseChoose',
				 	method: 'get',
					data: {
						token:uni.getStorageSync("token"),
						province:this.province,
						task_id:this.task_id
					},
				 }).then(res => {
				 	if (res.code == 1) {
						this.sellvshiList = res.data
						setTimeout(() => {
				 		 	clearInterval(this.intervalId);   
				 			this.percent = 100
				 			this.lvshow = true
				 			
				 			this.$nextTick(() => {
				 				this.scrollTop = this.scrollTop + 1000
				 			})
				 		 }, 2000)
				 	}
				 })
				
			},
		
			selJine(e) {
				console.log(e)
				this.jineShow = false
				this.messgageChatlist.push({
					member_id: 1,
					member_say: e.name,
					type: '1'
				})
				this.price_dur_min = e.min
				this.price_dur_max = e.max
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})

				setTimeout(() => {
					this.messgageChatlist.push({
						member_id: 2,
						member_say: '',
						type: '3'
					})
					this.$nextTick(() => {
						this.scrollTop = this.scrollTop + 1000
					})
				}, 1000)

			},
			sendMessage() {
				if(!this.content){
					uni.showToast({
						title: "请输入内容",
						icon: "none"
					});
					return
				}
				this.messgageChatlist.push({
					member_id: 1,
					member_say: this.content,
					type: '1'
				})
				this.$nextTick(() => {
					this.scrollTop = this.scrollTop + 1000
				})
				
				// setTimeout(() => {
					
					this.$api({
						url: '/search_task',
						method: 'get',
						data: {
							token: uni.getStorageSync("token"),
							content:this.content
						},
					}).then(res => {
							this.cnxwshow=false
							this.inputshow = false
							if(res.data.length>0){
								this.task_id = res.data[0].id
								this.typename = res.data[0].name
								this.messgageChatlist.push({
									member_id: 2,
									member_say: '根据您的描述，您当前案件类型为'+res.data[0].name,
									type: '1'
								})
							}else{
								this.task_id = '27'
								this.typename = '综合服务类型'
								this.messgageChatlist.push({
									member_id: 2,
									member_say: '根据您的描述，您当前案件类型为综合服务类型',
									type: '1'
								})
								
								this.$nextTick(() => {
									this.scrollTop = this.scrollTop + 1000
								})
							}
							
							this.messgageChatlist.push({
								member_id: 2,
								member_say: '',
								type: '2'
							})
							this.$nextTick(() => {
								this.scrollTop = this.scrollTop + 1000
							})
							// if(res.data.length>0){
							// 	this.cnxwshow=false
							// 	this.inputshow = false
							// 	this.task_id = res.data[0].id
							// 	this.typename = res.data[0].name
							// 	this.messgageChatlist.push({
							// 		member_id: 2,
							// 		member_say: '根据您的描述，您当前案件类型为'+res.data[0].name,
							// 		type: '1'
							// 	})
							// 	this.messgageChatlist.push({
							// 		member_id: 2,
							// 		member_say: '',
							// 		type: '2'
							// 	})
							// 	this.$nextTick(() => {
							// 		this.scrollTop = this.scrollTop + 1000
							// 	})
							// }else if(this.counum>1){
							// 	this.cnxwshow=false
							// 	this.inputshow = false
							// 	this.messgageChatlist.push({
							// 		member_id: 2,
							// 		member_say: '',
							// 		type: '4'
							// 	})
							// 	this.$nextTick(() => {
							// 		this.scrollTop = this.scrollTop + 1000
							// 	})
							// }else{
								
							// 	this.counum++
							// 	this.cnxwshow=true
							// 	if(this.content.length>6){
							// 		this.messgageChatlist.push({
							// 			member_id: 2,
							// 			member_say: '您的描述不清晰，请描述清晰一些哦',
							// 			type: '1'
							// 		})
							// 	}else{
							// 		this.messgageChatlist.push({
							// 			member_id: 2,
							// 			member_say: '您输入的字数太少啦，律师很难知道您遇到了什么问题，您可以稍微详细说明一下哦',
							// 			type: '1'
							// 		})
							// 	}
							// 	this.heightC = this.heightC-130
							// 	this.$nextTick(() => {
							// 		this.scrollTop = this.scrollTop + 1000
							// 	})
								
							// 	this.content = ''
							// }
						
					})
					
					
					 
				// }, 1000)
				
				
				
			},

			tozhifu(item) {
				this.$api({
					url: '/user/release_online',
					method: 'post',
					data: {
						token: uni.getStorageSync("token"),
						lawyer_id:item==-1?'':item.id,
						// task_id:this.task_id,
						// price_dur_min:this.price_dur_min,
						// price_dur_max:this.price_dur_max,
						price:this.price,
						// province:this.province,
						content:this.content,
						yhq_id:this.yhq_id
					},
				}).then(res => {
					if (res.code == 1) {
						
						// uni.showToast({
						// 	title: "发布成功",
						// 	icon: "none"
						// });
						// setTimeout(()=>{
						// 	uni.navigateBack()
						// },1000)
						// uni.redirectTo({
						// 	url: "/pages/index/paySuccess?list="+JSON.stringify(res.data)
						// })
						if(res.data.if_free==1){
							// uni.showToast({
							// 	title: "发布成功",
							// 	icon: "none"
							// });
							uni.redirectTo({
								url: "/pages/index/paySuccess?list="+JSON.stringify(res.data)
							})
							return
						}
						let that = this
						uni.requestPayment({
							provider: "wxpay",
							appid: res.data.pay_info.appId, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
							timeStamp: res.data.pay_info.timeStamp, // 时间戳（单位：秒）
							paySign: res.data.pay_info.paySign, //签名
							nonceStr: res.data.pay_info.nonceStr, // 随机字符串
							package: res.data.pay_info.prepay_id, // 固定值
							signType: res.data.pay_info.signType, // 签名算法，这里用的 MD5/RSA 签名
							success(res2) {
								if (res2.errMsg == "requestPayment:ok") {
									// uni.showToast({
									// 	title: "购买成功",
									// 	icon: "none"
									// });
									that.zhifushow = false
									uni.redirectTo({
										url: "/pages/index/paySuccess?list="+JSON.stringify(res.data)
									})
								}
							},
							fail(e) {
								console.log('支付失败支付失败支付失败', e)
								uni.showToast({
									title: "支付失败",
									icon: "none"
								});
							}
						})
						
						
					}
				})
				
				
				
				// uni.showToast({
				// 	title: "下单成功",
				// 	icon: "none"
				// });
				// uni.navigateTo({
				// 	url: "/pages/index/paySuccess"
				// })
			}
		}
	}
</script>

<style scoped lang="scss">
	.m-m2 {
		font-size: 44rpx;
		font-weight: bold;
	}
	.zf-i-div{
		width:600rpx;
		margin-left: 80rpx;
	}
	.zf-item {
		// margin-right: 24rpx;
		margin-top: 24rpx;
		text-align: center;
		width: 20%;
		.zf-img {
			width: 64rpx;
			height: 80rpx;
			border-radius: 8rpx;
			margin: 0 auto;
		}
	}

	.chbox {
		width: 42rpx;
		height: 42rpx;
		background: #F81B1B;
		border-radius: 50%;
		text-align: center;
		// line-height: 24rpx;
	}

	.btn-bo {
		width: 750rpx;
		height: 120rpx;
		background: #FFFFFF;
		box-shadow: 0rpx -2rpx 8rpx 2rpx rgba(0, 0, 0, 0.14);
		padding-top: 14rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 80;

		.btn_login_btn {
			width: 686rpx;
			height: 90rpx;
			background: linear-gradient(180deg, #FA2D2D 0%, #F40000 100%);
			border-radius: 46rpx 46rpx 46rpx 46rpx;
			// margin-top: 116rpx;
			font-size: 36rpx;
			color: #FFFFFF;
			line-height: 90rpx;
			margin-left: 32rpx;
			text-align: center;

			.xiadan {
				font-size: 36rpx;
				font-weight: bold;
			}

			.m-fh {
				font-weight: bold;
				font-size: 28rpx;
			}

			.m-m {
				font-weight: bold;
				font-size: 36rpx;
			}

			.m-sj {
				font-size: 28rpx;
			}
		}
	}

	.ch-item {
		width: 686rpx;
		// height: 184rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		padding: 24rpx;
		margin: 20rpx auto;

		.jdt-div {
			position: relative;
			width: 638rpx;
			height: 76rpx;
			margin-top: 24rpx;

			.jindu {
				width: 76rpx;
				height: 76rpx;
				position: absolute;
				top: -18rpx;
				z-index: 8;
			}
		}

		.lv-item {
			width: 290rpx;
			padding: 20rpx;
			background: #FDF5EF;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin-right: 20rpx;
		}

		.jp-i {
			width: 24rpx;
			height: 20rpx;
		}

		.ls-xing {
			width: 24rpx;
			height: 24rpx;
		}

		.ls-fs {
			font-size: 20rpx;
			color: #FD8643;
		}

		.ls-zy {
			padding-left: 10rpx;
			border-left: 1px #999 solid;
			margin-left: 10rpx;
		}

		.lv-item-headimg {
			width: 64rpx;
			height: 80rpx;
			border-radius: 8rpx;
		}

		.wid-r {
			width: 200rpx;
		}

		.zhifubtn {
			width: 254rpx;
			height: 56rpx;
			background: linear-gradient(180deg, #FA2D2D 0%, #F40000 100%);
			border-radius: 32rpx 32rpx 32rpx 32rpx;
			margin: 0 auto;
			margin-top: 20rpx;
			color: #fff;
		}
	}

	.po-bikan {
		padding: 40rpx 32rpx;
		background: #F6F6F6;
		width: 100%;
		position: relative;

		.shuxian {
			height: 300rpx;
			width: 2rpx;
			border-left: 4rpx dashed #FA2D2D;
			position: absolute;
			left: 50rpx;
		}

		.bk-title {
			font-weight: bold;
			font-size: 32rpx;
			color: #222222;
		}

		.jine-div {
			width: 686rpx;
			// height: 504rpx;
			padding: 32rpx 24rpx;
			background: #FFFFFF;
			border-radius: 32rpx 32rpx 32rpx 32rpx;

			.jine-item {
				margin: 14rpx;
				width: 184rpx;
				height: 64rpx;
				background: #FFFFFF;
				border-radius: 32rpx 32rpx 32rpx 32rpx;
				border: 2rpx solid #E5E5E5;
				font-size: 28rpx;
				color: #000000;
				text-align: center;
				line-height: 64rpx;
			}
		}
	}

	.reBtn {
		width: 100%;
		height: 64rpx;
		background: #FFFFFF;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		border: 2rpx solid #E5E5E5;
		font-size: 28rpx;
		color: #000000;
		text-align: center;
		line-height: 64rpx;
		margin-top: 24rpx;
	}

	.colred {
		color: #FA4C2C;
	}
	.gjz{
		position: fixed;
		bottom: 104rpx;
		z-index: 20;
		width: 100%;
		background-color: #fff;
		padding:16rpx 32rpx;
		
		.cnxw{
			padding-bottom: 12rpx;
			color: #999;
		}
		.gjz-item{
			border: 1px rgba(0, 0, 0, 0.1) solid;
			padding:4rpx 16rpx;
			border-radius: 22rpx;
			margin: 0 4rpx;
			color: #666;
			// background-color: #fff;
		}
	}
	.chatinput {
		position: fixed;
		bottom: 0rpx;
		z-index: 20;
		width: 100%;
		background-color: #fff;
		//	display: flex;
		// justify-content: space-between;
		align-items: center;
		border-top: 1px rgba(0, 0, 0, 0.1) solid;

		.inputtext {
			width: 600rpx;
			color: #333333;
			font-size: 28rpx;
			background-color: #f6f6f6;
			height: 72rpx;
			line-height: 72rpx;
			padding: 0 16rpx;
			border-radius: 222rpx;
		}

		.shurukuang {
			height: 100rpx;
			border-bottom: 1px rgba(0, 0, 0, 0.1) solid;
		}

		.sendbtn {
			margin-left: 20rpx;
			padding: 10rpx 20rpx;
			background-color: #00B42A;
			color: #FFFFFF;
			border-radius: 8rpx;
		}
	}

	.zhanwei {
		width: 100%;
		height: 100rpx;
	}

	.itemms {
		.headimg {
			width: 80rpx;
			height: 80rpx;
			border-radius: 50%;
			background-color: #EEEEEE;
		}

		.chatself {
			display: flex;
			flex-direction: row-reverse;
			width: 90%;
			margin-left: 5%;
			margin-top: 32rpx;
			//margin-bottom: 40rpx;
		}

		.chatother {
			display: flex;
			width: 90%;
			margin-left: 5%;
			margin-top: 32rpx;
			margin-bottom: 40rpx;
		}

		.chatbgvS {
			margin-top: 8rpx;
			max-width: 524rpx;
			background-color: #FFE6D1;
			border-radius: 8rpx;
			padding: 16rpx;
			padding-top: 12rpx;
			line-height: 44rpx;
			margin-right: -12rpx;
		}

		.chatbgvO {
			margin-top: 8rpx;
			padding: 16rpx;
			padding-top: 12rpx;
			max-width: 524rpx;
			background-color: #FFFFFF;
			border-radius: 8rpx;
			line-height: 44rpx;
			margin-left: -12rpx;
		}


	}

	.buzhou {
		width: 750rpx;
		height: 88rpx;
		background: #FFFFFF;
		padding: 0 32rpx;
		margin-bottom: 24rpx;

		.buzhou-item {

			.buzhou-item-num {
				width: 42rpx;
				height: 42rpx;
				border-radius: 50%;
				font-size: 28rpx;
				color: #FFFFFF;
				font-weight: bold;
				text-align: center;
				line-height: 42rpx;
				background: #CCCCCC;
			}


			.buzhou-item-text {
				font-size: 28rpx;
				color: #666666;
				margin-left: 12rpx;
			}

			&-sel {
				.buzhou-item-num {
					background: linear-gradient(180deg, #FA472D 0%, #F41D00 100%);
				}

				.buzhou-item-text {
					font-size: 28rpx;
					color: #333333;
					font-weight: bold;
				}
			}
		}
	}

	.ls-div {
		position: relative;
		width: 686rpx;
		// height: 120rpx;
		background: linear-gradient(90deg, #FFF8EF 0%, #FFFBF5 55%, #FFF8EF 100%);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		border: 2rpx solid #F4CF9C;
		padding: 18rpx 24rpx;
		margin: 0 auto;

		.ls-top {
			font-weight: bold;
			font-size: 32rpx;
			color: #8C5811;

			.t-num {
				color: #FD7A22;
			}
		}

		.lszy {
			font-size: 24rpx;
			color: #FF640D;
		}

		.ls-d-t {
			border-bottom: 1px #ECE4D9 dashed;
		}

		.ls-sss-item {
			margin-top: 10rpx;

			.ls-sss {
				width: 24rpx;
				height: 24rpx;
			}

			.ls-te {
				font-weight: bold;
				font-size: 20rpx;
				color: #B89D7B;
			}
		}

		.tw-lsbg {
			width: 134rpx;
			height: 136rpx;
			position: absolute;
			right: 0;
			bottom: 0;
		}

		.headimg {
			height: 84rpx;
			width: 68rpx;
			border-radius: 8rpx;
		}

		.h23 {
			width: 24rpx;
			height: 20rpx;
		}

		.h24 {
			width: 24rpx;
			height: 24rpx;
			margin-right: 8rpx;
		}

		.pf-t {
			font-size: 20rpx;
			color: #FD8643;
		}
	}
</style>